<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
	<head th:replace="common/style_script::head('如意后台登录','/static/bootstrap-3.3.7/css/bootstrap.css')">
	<meta  charset="UTF-8"/>
	<title>如意后台登录</title>
	</head>
	<link th:href="@{/static/backStageLogin.css}" rel="stylesheet"/>
	<body style="background-color:#F5F5F5">
		<div class="container">
        <div class="wrap">
            <header>
            	<em style="margin-left:30px;font-family:FZShuTi;font-weight:blod">
					ruyi&nbsp;如意后台管理系统</em>
			</header>
            <article>
                <section>
                	<div id="onlineMsg_warning">
                		<font>在线留言:【<a id="onlineMsg_num" href="#">0</a>】尚未阅读</font><br/>
                		<font>待处理订单:【<a id="ording_num" href="#">0</a>】请尽快处理</font><br/>
                		<font>当前在线用户:【<a id="onlineNum" href="/thy/sys/showOnlineUser"></a>】人</font>
            		</div>
                    <aside>
                        <em>
                            <img th:src="@{/static/img/user.png}" />
                        </em>
                         <form id="backstagelogin_form"  method="post"
                         class="bs-example bs-example-form" role="form" onsubmit="onLoginSubmit();">
                         
                         	<input type="hidden" id="bs" name="bs" value="backstage"/>
                            <p class="name"><i></i>
                            	<input type="text" id="username" name="username" class="userName" placeholder="请输入用户名"/>
                            	<span id="backstage_username_warning" style="display: none;color:red"></span>
                            </p>
                            
                            <p class="password"><i></i>
                            	<input type="password" id="password" name="password" class="pwd" placeholder="请输入密码"/>
                            	<span id="backstage_password_warning" style="display: none;color:red"></span>
                            </p>
                            <p>
                            	<div class="form-group" style="margin-top:5px;width:100%;">
									<span id="login_msg2" style="color:red"></span>
								</div>
                            </p>
                            <input type="button" class="btn btn-primary" id="backstage_btn_submit" 
                            value="登&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;录"></input>
                            <p class="remember"><input id="remember" type="checkbox" name="remember" />记住密码</p>
                            <p class="regist"><span>没有账号?</span><a th:href="@{/thy/static/registerPage}">立即注册</a></p>
                            <div class="clear"></div>
                        </form>
                    </aside>
                   
                </section>               
            </article>
            <footer>
                <ul>
                    <li><a href="#">联系我们</a></li>
                    <li><a href="#">关于我们</a></li>
                    <li><a href="#">人才招聘</a></li>
                    <li><a href="#">友情链接</a></li>
                    <li><a href="#">公司地址</a></li>
                    <li><a href="#">关注我们</a></li>
                </ul>
                <p>============================</p>
            </footer>
        </div>
    </div>
	</body>
	<script>
	var username="";
	var password="";
	var remember=false;
	
	$(function(){
		//检查当前是否已经登录
		/* checked_login(); */
		onLineUser();
		//失去焦点提示信息消失隐藏
		$("#username").blur(function(){
			username=$("#username").val().trim();
			if(username !=""){
				$("#backstage_username_warning").css("display","none");
			}
		})
		$("#password").blur(function(){
			password=$("#password").val().trim();
			if(password !=''){
				$("#backstage_password_warning").css("display","none");
			}
		})
		
		//点击登录按钮进行登录
		$("#backstage_btn_submit").click(function(){
			submit();
		})
		//点击回车键(Enter)进行登录
		$(document).keyup(function(even){
			if(even.keyCode==13){
				submit();
			}
		})
		
	})
	
	//获取当前用户在线数量
	function onLineUser(){
		$.ajax({
			type:'get',
			url:'/thy/sys/getOnlineNum',
			dataType:'json',
			success:function(data){
				$("#onlineNum").html(data);
			}
		})
		
	}
	//检查是否已经登录，如果已经登录了，刷新页面直接跳转到首页，否则还是登录页面
	function checked_login(){
		
		$.ajax({
			type:'GET',
			url:'/thy/sys/checked_login',
			dataType:'json',
			success:function(data){
				if(data.status==200){
					window.location.href='/thy/backstage';
				}
			}
		})
	}
	
	//登录
	function submit(){
		username=$("#username").val().trim();
		password=$("#password").val().trim();
		remember=$("#remember").prop('checked');
		var $form=$("#backstagelogin_form");
		if(username==""){
			$("#backstage_username_warning").css("display","block");
			$("#backstage_username_warning").html("用户名不能为空!");
			return false;
		}
		if(password==""){
			$("#backstage_password_warning").css("display","block");
			$("#backstage_password_warning").html("密码不能为空!");
			return false;
		}
		//使用Ajax提交form表单
		var param={'username':username,'password':password,'remember':remember,'bs':'back_stage'};
		$.ajax({
			type:'GET',
			url:'/thy/sys/toLogin',
			data:param,
			dataType:'json',
			beforeSend:function(){
				
			},
			success:function(data){
				if(data.status==200){
					window.location.href='/thy/backstage';	
				}else{
					$("#username").val(data.username);
					$("#password").val(data.password);
					$("#login_msg2").html(data.message);
				}
			},
			error:function(e){
				console.log(e);
				layer.msg('出错咯o(╥﹏╥)o,请与后台联系!',{
                btn:'我知道了'
             })
			}
		})
	}
	</script>
	<script type="text/javascript">
		$(function(){
			//定时查询订单数，在线留言数
			setInterval("getOnlineMsgCount();getOrdersCount();",1000*60);
			setInterval("onLineUser()",1000*30);
		})
		
		function getOnlineMsgCount(){
			$.ajax({
				type:'get',
				url:'/kf/getOnlineCount',
				type:'GET',
				dataType:'json',
				success:function(data){
					$("#onlineMsg_num").html(data.num+"条");
				},
				error:function(e){
					
				}
			})
		}
		
		function getOrdersCount(){
			$.ajax({
				type:'get',
				url:'/thy/order/getSendOrderCount',
				dataType:'json',
				success:function(data){
					$("#ording_num").html(data.count+"条");
				},
				error:function(data){
					
				}
			})
		}
		
	</script>
</html>

